<template>
	<view>
		<view class="mask" v-if="functionBox" @click="hideMask"></view>
		<view class="content" @touchstart="hideDrawer">
			<scroll-view class="msg-list" scroll-y="true" id="scrollview"
				:class="destructionMessageStatus ? 'back-theme' : ''" :scroll-with-animation="scrollAnimation"
				:scroll-top="scrollTop" :scroll-into-view="scrollToView" @scrolltoupper="loadHistory"
				upper-threshold="50" :style="screenHeight">
				<!-- <view class="count-down" v-if="destructionMessageStatus">{{ countDown }}</view> -->
				<!-- 加载历史数据waitingUI -->
				<view class="row" v-for="(item, index) in msgList" :key="index" :id="item.ID" v-if="!item.isRevoked">
					<!-- 用户消息 -->
					<view class="funcBtn" :style="funcBox_position" v-if="functionBox == item.ID">
						<view class="func" @click="revokeMessage(item)">撤回</view>
						<view class="func" @click="copyText" v-if="item.type == TIM.TYPES.MSG_TEXT">复制</view>
					</view>
					<block v-if="item.payload.data != 'videoChat' && item.payload.data != 'voiceChat' ">
						<!-- 自己发出的消息 -->
						<view class="my" v-if="item.flow == 'out'">
							<!-- 左-消息 -->
							<view class="left" ref="item">
								<!-- 文字消息 -->
								<view @longpress="showFunctionBox(item)" :class="item.ID"
									v-if="item.type == TIM.TYPES.MSG_TEXT" class="bubble box-pandding">
									<rich-text :nodes="nodesFliter(item.payload.text)"></rich-text>
								</view>
								<!-- 文字消息 -->
								<view @longpress="showFunctionBox(item)" :class="item.ID"
									v-if="item.payload.data == 'chatFile'" style="" @tap="showPic(item)">
									<view class="chatImg">
										<image :src="item.payload.description" mode="widthFix"></image>
									</view>
								</view>
								<!-- 语言消息 -->
								<view @longpress="showFunctionBox(item)" v-if="item.payload.data == 'voiceFile'"
									class="bubble voice box-pandding" @tap="playVoice(item)"
									:class="playMsgid == item.ID ? 'play' : '' + item.ID">
									<view class="length">{{ item.payload.extension }}</view>
									<view class="icon my-voice"></view>
								</view>
								<!-- 视频消息 -->
								<view @longpress="showFunctionBox(item)" :class="item.ID"
									v-if="item.payload.data == 'videoFile'" class="bubble">
									<view class="videoBox">
										<image class="playImg" @click="playVideo(item.payload.description)"
											src="../../static/play.png" mode=""></image>
									</view>
								</view>
								<!-- 地图消息 -->
								<view @longpress="showFunctionBox(item)" :class="item.ID"
									v-if="item.payload.data == 'mapFile'" class="bubble video map"
									style="background-color: #2ec5f4;">
									<!-- <view class="map-text">{{ item.payload.description.message }}</view> -->
									<view class="map-content1" @click="checkMyLocation(item.payload.description)">
										<input style="width: 170rpx;" placeholder="我的位置" disabled="true" />
										<image style="width: 32rpx;height: 32rpx;" src="../../static/my/location.png"
											mode=""></image>
									</view>
								</view>
								<!-- 红包信息 -->
								<view v-if="item.payload.data == 'redEnvelopeData'">
									<!-- <view class="map-text">{{ item.payload.description.message }}</view> -->
									<view class="redEnvelopeBox">
										<image class="redEnvelopeSendIcon" src="../../static/img/redEnvelopeSend.png"
											mode=""></image>
									</view>
								</view>
								<view v-if="item.payload.data == 'redEnvelopeRes'" class="red-Res">
									你领取了{{ toUserInfo.nick }}的红包</view>
								<!-- 	<view v-if="item.payload.data == 'voiceChat'" class="bubble video map" style="background-color: #2ec5f4;">
									<view class="map-content1" style="width: 240rpx;"><input placeholder="邀请您音频通话" style="width: 240rpx;" disabled="true" /></view>
								</view> -->
								<view v-if="item.payload.data == 'voiceChatCancel'" class="bubble video map"
									style="background-color: #2ec5f4;">
									<view class="map-content1" style="width: 240rpx;"><input placeholder="拒绝了音频通话"
											style="width: 240rpx;" disabled="true" /></view>
								</view>
								<view v-if="item.payload.data == 'voiceChatSelfCancel'" class="bubble video map"
									style="background-color: #2ec5f4;">
									<view class="map-content1" style="width: 240rpx;"><input placeholder="挂断了音频通话"
											style="width: 240rpx;" disabled="true" /></view>
								</view>
								<!-- <view v-if="item.payload.data == 'videoChat'" class="bubble video map" style="background-color: #2ec5f4;">
									<view class="map-content1" style="width: 240rpx;"><input placeholder="邀请您视频通话" style="width: 240rpx;" disabled="true" /></view>
								</view> -->
								<view v-if="item.payload.data == 'videoChatCancel'" class="bubble video map"
									style="background-color: #2ec5f4;">
									<view class="map-content1" style="width: 240rpx;"><input placeholder="拒绝了视频通话"
											style="width: 240rpx;" disabled="true" /></view>
								</view>
								<view v-if="item.payload.data == 'videoChatSelfCancel'" class="bubble video map"
									style="background-color: #2ec5f4;">
									<view class="map-content1" style="width: 240rpx;"><input placeholder="挂断了视频通话"
											style="width: 240rpx;" disabled="true" /></view>
								</view>
								<view v-if="item.payload.data == 'videoChatBusy'" class="bubble video map"
									style="background-color: #2ec5f4;">
									<view class="map-content1" style="width: 240rpx;"><input placeholder="正在通话中"
											style="width: 240rpx;" disabled="true" /></view>
								</view>
							</view>
							<!-- <view class="left-img" :style="(item.payload.data != 'chatFile') & 'redEnvelopeData' ? '' : 'background:rgb(229,229,229)'"></view> -->
							<!-- 右-头像 -->
							<view class="right" style="background-color: #FFFFFF;border-radius: 15rpx;"
								v-if="item.payload.data != 'redEnvelopeRes'">
								<image :src="userInfo.avatar"></image>
							</view>
						</view>
						<!-- 别人发出的消息 -->
						<view class="other" v-else-if="item.flow == 'in'">
							<!-- 左-头像 -->
							<view class="left" style="background-color: #FFFFFF;border-radius: 15rpx;"
								v-if="item.payload.data != 'redEnvelopeRes'">
								<image @tap="toPage(item)" :src="toUserInfo.avatar"></image>
							</view>
							<!-- 右-用户名称-时间-消息 -->
							<view class="right">
								<view class="username" v-if="item.payload.data != 'redEnvelopeRes'">
									<!-- <view class="name">{{ toUserInfo.nickname }}</view> -->
									<view class="time">
										{{ timeFliter(item.time) }}</view>
								</view>
								<!-- <view class="right-img" :style="(item.payload.data != 'chatFile') & 'redEnvelopeData' ? '' : 'background:rgb(229,229,229)'"></view> -->
								<!-- 文字消息 -->
								<view v-if="item.type == TIM.TYPES.MSG_TEXT" class="bubble box-pandding">
									<rich-text :nodes="nodesFliter(item.payload.text)"></rich-text>
								</view>
								<view v-if="item.payload.data == 'chatFile'" @tap="showPic(item)">
									<view class="chatImg">
										<image :src="item.payload.description" mode="widthFix"></image>
									</view>
								</view>
								<!-- 语言消息 -->
								<view v-if="item.payload.data == 'voiceFile'" class="bubble voice box-pandding"
									@tap="playVoice(item)" :class="playMsgid == item.ID ? 'play' : ''">
									<view class="icon other-voice"></view>
									<view class="length">{{ item.payload.extension }}</view>
								</view>
								<!-- 视频消息 -->
								<view v-if="item.payload.data == 'videoFile'" class="bubble">
									<view class="videoBox">
										<image class="playImg" @click="playVideo(item.payload.description)"
											src="../../static/play.png" mode=""></image>
									</view>
								</view>
								<!-- 地图消息 -->
								<view v-if="item.payload.data == 'mapFile'" class="bubble video map"
									style="background-color: #2ec5f4;">
									<!-- <view class="map-text">{{ item.payload.description.message }}</view> -->
									<view class="map-content1" @click="checkMyLocation(item.payload.description)">
										<input style="width: 170rpx;" placeholder="我的位置" disabled="true" />
										<image style="width: 32rpx;height: 32rpx;" src="../../static/my/location.png"
											mode=""></image>
									</view>
								</view>
								<!-- 红包 -->
								<view v-if="item.payload.data == 'redEnvelopeData'">
									<view class="redEnvelopeBox" @click="getredEnvelope(item)">
										<image class="redEnvelopeSendIcon" src="../../static/img/redEnvelopeSend.png"
											mode=""></image>
									</view>
								</view>
								<view v-if="item.payload.data == 'redEnvelopeRes'" class="red-Res-item">
									{{ toUserInfo.nick }}领取了你的红包</view>
								<!-- <view v-if="item.payload.data == 'voiceChat'" class="bubble video map" style="background-color: #2ec5f4;">
									@click="toVoiceRoom(item.payload.description)"
									<view class="map-content1" style="width: 240rpx;"><input placeholder="邀请您音频通话" style="width: 240rpx;" disabled="true" /></view>
								</view> -->
								<view v-if="item.payload.data == 'voiceChatCancel'" class="bubble video map"
									style="background-color: #2ec5f4;">
									<view class="map-content1" style="width: 240rpx;"><input placeholder="拒绝了音频通话"
											style="width: 240rpx;" disabled="true" /></view>
								</view>
								<view v-if="item.payload.data == 'voiceChatSelfCancel'" class="bubble video map"
									style="background-color: #2ec5f4;">
									<view class="map-content1" style="width: 240rpx;"><input placeholder="挂断了音频通话"
											style="width: 240rpx;" disabled="true" /></view>
								</view>
								<!-- <view v-if="item.payload.data == 'videoChat'" class="bubble video map" style="background-color: #2ec5f4;">
									@click="toVoiceRoom(item.payload.description)"
									<view class="map-content1" style="width: 240rpx;"><input placeholder="邀请您视频通话" style="width: 240rpx;" disabled="true" /></view>
								</view> -->
								<view v-if="item.payload.data == 'videoChatCancel'" class="bubble video map"
									style="background-color: #2ec5f4;">
									<view class="map-content1" style="width: 240rpx;"><input placeholder="拒绝了视频通话"
											style="width: 240rpx;" disabled="true" /></view>
								</view>
								<view v-if="item.payload.data == 'videoChatSelfCancel'" class="bubble video map"
									style="background-color: #2ec5f4;">
									<view class="map-content1" style="width: 240rpx;"><input placeholder="挂断了视频通话"
											style="width: 240rpx;" disabled="true" /></view>
								</view>
								<view v-if="item.payload.data == 'videoChatBusy'" class="bubble video map"
									style="background-color: #2ec5f4;">
									<view class="map-content1" style="width: 240rpx;"><input placeholder="对方正在通话中"
											style="width: 240rpx;" disabled="true" /></view>
								</view>
							</view>
						</view>
					</block>
				</view>
				<view id="bottom"></view>
			</scroll-view>
		</view>
		<!-- 抽屉栏 -->
		<view class="popup-layer" :class="popupLayerClass" @touchmove.stop.prevent="discard">
			<!-- 表情 -->
			<swiper class="emoji-swiper" :class="{ hidden: hideEmoji }" indicator-dots="true" duration="150">
				<swiper-item v-for="(page, pid) in emojiList" :key="pid">
					<view v-for="(em, eid) in page" :key="eid" @tap="addEmoji(em)">
						<image mode="widthFix" :src="'/static/img/emoji/' + em.url"></image>
					</view>
				</swiper-item>
			</swiper>
			<!-- 更多功能 相册-拍照-红包 -->
			<view class="more-layer" :class="{ hidden: hideMore }">
				<view class="list">
					<view class="clearfix">
						<view class="box" @tap="chooseImage">
							<view class="icon tupian2"></view>
						</view>
						<view class="text" style="text-align: center;">相册</view>
					</view>
					<view class="clearfix">
						<view class="box" @tap="camera">
							<view class="icon paizhao"></view>
						</view>
						<view class="text" style="text-align: center;">拍照</view>
					</view>

					<view class="clearfix">
						<view class="box" @tap="video">
							<view class="icon">
								<image style="width:28px;height: 28px;padding-top: 7px; "
									src="../../static/pages/video.png"></image>
							</view>
						</view>
						<view class="text" style="text-align: center;">视频</view>
					</view>

					<view class="clearfix">
						<view class="box" @tap="getLocation">
							<view class="icon">
								<image style="width:28px;height: 28px;padding-top: 7px; "
									src="../../static/img/address.png"></image>
							</view>
						</view>
						<view class="text" style="text-align: center;">定位</view>
					</view>

					<view class="clearfix">
						<view class="box" @tap="sendRedEnvelopes">
							<view class="icon">
								<image style="width:28px;height: 28px;padding-top: 7px; "
									src="../../static/img/redEnvelopes.png"></image>
							</view>
						</view>
						<view class="text" style="text-align: center;">红包</view>
					</view>

					<view class="clearfix" @tap="toVoiceTalk">
						<view class="box">
							<view class="icon">
								<image style="width:28px;height: 28px;padding-top: 7px; "
									src="../../static/img/voiceChat.png"></image>
							</view>
						</view>
						<view class="text" style="text-align: center;">语音通话</view>
					</view>
					<view class="clearfix" @tap="toVideoChat">
						<view class="box">
							<view class="icon">
								<image style="width:28px;height: 28px;padding-top: 7px; "
									src="../../static/img/voiceChat.jpg"></image>
							</view>
						</view>
						<view class="text" style="text-align: center;">视频聊天</view>
					</view>
					<view class="clearfix" v-if="!destructionMessageStatus">
						<view class="box" @tap="openDestructionMessage(0)">
							<!-- <view class="icon"><image style="width:28px;height: 28px;padding-top: 7px; " src="../../static/img/voiceChat.jpg"></image></view>-->
							<switch style="transform:scale(0.75,0.75)"></switch>
						</view>
						<view class="text" style="text-align: center;">阅后即焚</view>
					</view>
					<view class="clearfix" v-if="destructionMessageStatus">
						<view class="box" @tap="openDestructionMessage(1)">
							<!-- <view class="icon"><image style="width:28px;height: 28px;padding-top: 7px; " src="../../static/img/voiceChat.jpg"></image></view> -->
							<switch style="transform:scale(0.75,0.75)"></switch>
						</view>
						<view class="text" style="text-align: center;">关闭阅后即焚</view>
					</view>
				</view>
			</view>
		</view>
		<voiceChatModal></voiceChatModal>
		<video-chat></video-chat>
		<!-- 底部输入栏 -->
		<view class="input-box" :class="popupLayerClass" @touchmove.stop.prevent="discard">
			<!-- H5下不能录音，输入栏布局改动一下 -->
			<!-- #ifndef H5 -->
			<view class="voice">
				<view class="icon" :class="isVoice ? 'jianpan' : 'yuyin'" @tap="switchVoice"></view>
			</view>
			<!-- #endif -->
			<!-- #ifdef H5 -->
			<view class="more" @tap="showMore">
				<view class="icon add"></view>
			</view>
			<!-- #endif -->
			<view class="textbox">
				<view class="voice-mode" :class="[isVoice ? '' : 'hidden', recording ? 'recording' : '']"
					@touchstart="voiceBegin" @touchmove.stop.prevent="voiceIng" @touchend="voiceEnd"
					@touchcancel="voiceCancel">
					{{ voiceTis }}
				</view>
				<view class="text-mode" :class="isVoice ? 'hidden' : ''">
					<view class="box"><textarea auto-height="true" v-model="textMsg" @focus="textareaFocus" /></view>
					<!-- <view class="em" @tap="chooseEmoji"><view class="icon biaoqing"></view></view> -->
				</view>
			</view>
			<!-- #ifndef H5 -->
			<view class="more" @tap="showMore">
				<view class="icon add"></view>
			</view>
			<!-- #endif -->
			<view class="send" :class="isVoice ? 'hidden' : ''" @tap="sendText">
				<view class="btn">发送</view>
			</view>
		</view>
		<!-- 录音UI效果 -->
		<view class="record" :class="recording ? '' : 'hidden'">
			<view class="ing" :class="willStop ? 'hidden' : ''">
				<view class="icon luyin2"></view>
			</view>
			<view class="cancel" :class="willStop ? '' : 'hidden'">
				<view class="icon chehui"></view>
			</view>
			<view class="tis" :class="willStop ? 'change' : ''">{{ recordTis }}</view>
		</view>
	</view>
</template>
<script>
	import userList from '../../commen/tim/user.js';
	import {
		mapState
	} from 'vuex';
	import chooseFile from '@/js_sdk/tencentcloud-plugin-cos/choose-file.js';
	import uploadFile from '@/js_sdk/tencentcloud-plugin-cos/upload-file.js';
	import getFileAccessUrl from '@/js_sdk/tencentcloud-plugin-cos/get-file-access-url.js';

	function arrive_timer_format(s) {
		let t = '';
		if (s > -1) {
			let hour = Math.floor(s / 3600);
			let min = Math.floor(s / 60) % 60;
			let sec = s % 60;
			let day = parseInt(hour / 24);
			if (day > 0) {
				hour = hour - 24 * day;
				t = day + ':' + hour + ":";
			}
			if (hour > 0) {
				t = hour + ":";
			}
			if (min < 10) {
				t += "0";
			}
			t += min + ":";
			if (sec < 10) {
				t += "0";
			}
			t += sec;
		}
		return t;
	}

	export default {
		data() {
			return {
				//TIM变量
				conversationActive: null,
				toUserId: '',
				toUserInfo: null,
				userInfo: null,
				nextReqMessageID: '',
				count: 15,
				isCompleted: '',
				msgList: [],
				TIM: null,
				// 地图
				latitude: '',
				longitude: '',
				//文字消息
				textMsg: '',
				//消息列表
				isHistoryLoading: false,
				scrollAnimation: false,
				scrollTop: 99999,
				scrollToView: '',
				msgImgList: [],
				myuid: 0,
				msgID: '',
				//录音相关参数
				// #ifndef H5
				//H5不能录音
				RECORDER: uni.getRecorderManager(),
				// #endif
				isVoice: false,
				voiceTis: '按住 说话',
				recordTis: '手指上滑 取消发送',
				recording: false,
				willStop: false,
				initPoint: {
					identifier: 0,
					Y: 0
				},
				recordTimer: null,
				recordLength: 0,

				//播放语音相关参数
				AUDIO: uni.createInnerAudioContext(),
				playMsgid: null,
				VoiceTimer: null,
				// 抽屉参数
				popupLayerClass: '',
				// more参数
				hideMore: true,
				//表情定义
				hideEmoji: true,
				emojiList: this.$commen.emojiList,
				//表情图片图床名称 ，由于我上传的第三方图床名称会有改变，所以有此数据来做对应，您实际应用中应该不需要
				onlineEmoji: {
					'100.gif': 'AbNQgA.gif'
				},
				//红包相关参数
				windowsState: '',
				redenvelopeData: {
					rid: null, //红包ID
					from: null,
					face: null,
					blessing: null,
					money: null
				},
				style: {},
				screenHeight: '',
				redArr: [],
				redResArr: [],
				functionBox: '',
				funcBox_position: 0,
				roomID: 0,
				newData: [],
				destructionMessageStatus: false,
				timer: '',
				countDown: 15,
				audioRestriction: false
			};
		},
		computed: {
			...mapState({
				currentMessageList: state => state.currentMessageList
			})
		},
		onShow() {
			// this.getRedData()
			uni.setNavigationBarTitle({
				title: this.toUserInfo.nick || this.toUserInfo.nickname
			});
			// this.$store.commit('setVoiceChatUser', this.userInfo)
			// this.$store.commit('setVoiceModalShow', true)
			// 发送通话时长的消息
			let sec = uni.getStorageSync('voiceChatTime')
			if (uni.getStorageSync('voiceChatTime')) {
				let msg = {
					text: '通话时长：' + arrive_timer_format(sec)
				};
				this.sendMsg(msg, 'text');
				uni.removeStorageSync('startTime')
				uni.removeStorageSync('endTime')
				uni.removeStorageSync('voiceChatTime')
			}

			let voiceChatTime = uni.getStorageSync('videoChatTime')
			if (voiceChatTime) {
				let msg = {
					text: '通话时长：' + arrive_timer_format(voiceChatTime)
				};
				this.sendMsg(msg, 'text');
				uni.removeStorageSync('startTime')
				uni.removeStorageSync('endTime')
				uni.removeStorageSync('videoChatTime')
			}

		},
		watch: {

			currentMessageList(newVal, oldVal) {
				if (newVal) {
					let that = this;
					let data = newVal;
					this.newData = newVal;
					for (let i = 0; i < newVal.length; i++) {
						if (newVal[i].payload.data == 'mapFile' && newVal[i].payload.description != '') {
							if (typeof newVal[i].payload.description != 'object') {
								newVal[i].payload.description = JSON.parse(newVal[i].payload.description);
							}
						}
					}
					setTimeout(() => {
						this.msgList = newVal;
						this.screenMsg(newVal, oldVal);
						this.scrollTop = 99999;
					}, 200);
				}
			},
			msgList(newVal, oldVal) {
				this.$nextTick(() => {
					this.scrollTop = 9999
				})
			}
		},
		onLoad(option) {
			this.screenHeight = 'height:' + this.$systemInfo.screenHeight - 110 + 'px';
			this.userInfo = JSON.parse(uni.getStorageSync('userInfo'));
			let avatar_arr = JSON.parse(this.userInfo.avatar)
			this.userInfo.avatar = avatar_arr.shift();
			this.toUserInfo = uni.getStorageSync('chooseUser');
			if (this.toUserInfo.avatar.indexOf('[') > -1) {
				this.toUserInfo.avatar = JSON.parse(this.toUserInfo.avatar)[0];
			} else if (this.toUserInfo.avatar.length == 1) {
				this.toUserInfo.avatar = this.toUserInfo.avatar[0];
			} else {}
			setTimeout(() => {
				uni.setNavigationBarTitle({
						title: this.toUserInfo.nick
					},
					300
				);
			});
			this.toUserId = this.$store.state.toUserId;
			this.conversationActive = this.$store.state.conversationActive;
			this.TIM = this.$TIM;
			this.$nextTick(() => {
				this.scrollTop = 9999
			})
			//获取聊天对象的用户信息
			// userList.forEach(item=>{
			// 	if(this.toUserId == item.userId){
			// 		this.toUserInfo = item
			// 	}
			// })
			this.getMsgList();
			//语音自然播放结束
			this.AUDIO.onEnded(res => {
				this.playMsgid = null;
			});
			// #ifndef H5
			//录音开始事件
			this.RECORDER.onStart(e => {
				this.recordBegin(e);
			});

			//录音结束事件
			this.RECORDER.onStop(e => {
				if (!this.willStop) {
					this.recordEnd(e);
				}
			});
			// #endif
			setTimeout(() => {
				if (!!option.message) {
					this.latitude = option.latitude;
					this.longitude = option.longitude;
					// console.log(option);
					let msg = {
						text: JSON.stringify(option)
					};
					this.sendMsg(msg, 'mapFile');
				} else if (!!option.cbData) {
					let cbData = option.cbData;
					this.sendMsg(cbData, 'redEnvelopeData');
				}
			}, 300);
			setTimeout(() => {
				this.scrollToView = 'bottom';
				this.$nextTick(function() {
					this.scrollAnimation = true;
				});
			}, 500);
		},
		onUnload() {
			//退出页面 将所有的会话内的消息设置为已读
			let promise = this.tim.setMessageRead({
				conversationID: this.conversationActive.conversationID
			});
			promise
				.then(function(imResponse) {
					// console.log('全部已读');
					// 已读上报成功
				})
				.catch(function(imError) {
					// 已读上报失败
					console.warn('setMessageRead error:', imError);
				});
		},
		methods: {
			// 开启阅后即焚
			openDestructionMessage(status) {
				if (status === 0) {
					this.destructionMessageStatus = true;
				} else {
					this.destructionMessageStatus = false;
				}
			},
			hideMask() {
				this.functionBox = false;
			},
			showFunctionBox(item) {
				this.copyData = item;
				this.functionBox = item.ID;
				let id = '.' + item.ID;
				const query = uni.createSelectorQuery().in(this);
				query
					.select(id)
					.boundingClientRect(data => {
						// console.log(data);
						let left = data.left + data.width / 2 - 55;
						let bottom = data.bottom;
						this.funcBox_position = 'left:' + left + 'px;';
					})
					.exec();
			},
			copyText() {
				let that = this;
				uni.setClipboardData({
					data: that.copyData.payload.text,
					success: res => {
						that.functionBox = false;
					}
				});
			},
			revokeMessage(message) {
				let that = this;
				let promise = this.tim.revokeMessage(message);
				promise
					.then(function(imResponse) {
						that.functionBox = false;
					})
					.catch(function(imError) {
						that.functionBox = false;
						uni.showToast({
							title: '消息撤回超过了两分钟',
							icon: 'none',
							success: res => {}
						});
					});
			},
			getredEnvelope(data) {
				let userInfo = this.toUserInfo;
				let redEnvelopeData = JSON.parse(data.payload.description);
				let formData = {
					id: redEnvelopeData.data
				};
				userInfo.money = redEnvelopeData.money;
				this.$utils.postrequest('/api/tim/collect_red', formData, res => {
					if (res.code === 200) {
						this.sendMsg(JSON.stringify(formData.id), 'redEnvelopeRes');
						uni.navigateTo({
							url: 'HM-details/HM-details?data=' + JSON.stringify(userInfo)
						});
					} else if (res.code === 300) {
						uni.showToast({
							icon: 'none',
							title: res.message
						});
					}
				});
			},
			checkMyLocation(description) {
				uni.navigateTo({
					url: 'roomDetails/checkLocation/checkLocation?description=' + JSON.stringify(description)
				});
			},
			playVideo(data) {
				uni.navigateTo({
					url: 'roomDetails/playVideo/playVideo?url=' + data
				});
			},
			sendRedEnvelopes() {
				let userId = '';
				if (!!this.toUserInfo.userID) {
					userId = this.toUserInfo.userID.toString();
				} else {
					userId = this.toUserInfo.id.toString();
				}
				uni.navigateTo({
					url: './HM-hand/HM-hand?userId=' + userId
				});
			},
			// 自己发起聊天
			toVoiceTalk() {
				if (this.audioRestriction) return
				this.audioRestriction = true
				uni.showLoading()
				let userId = null;
				if (!!this.toUserInfo.userID) {
					userId = this.toUserInfo.userID.toString();
				} else {
					userId = this.toUserInfo.id.toString();
				}
				this.$utils.postrequest("/api/is_video", {
					user_id: userId
				}, res => {
					if (res.code == 200) {
						uni.hideLoading()
						let status = res.data
						if (status) {
							this.audioRestriction = false
							uni.showToast({
								title: '正在通话中',
								icon: 'none'
							})
						} else {
							this.startVoiceTalk()
						}
					}
				})
			},
			startVoiceTalk() {
				uni.setStorageSync('chooseUser', JSON.stringify(this.toUserInfo));
				this.$utils.request("/api/tim/voiceRoomId", {}, res => {
					if (res.code == 200) {
						this.audioRestriction = false
						this.roomID = res.data
						uni.setStorageSync("roomid", this.roomID)
						this.sendMsg(res.data, 'voiceChat')
						uni.navigateTo({
							url: "../TRTC/TRTC?open=1"
						})
					}
				})
			},
			toVideoChat() {
				if (this.audioRestriction) return
				this.audioRestriction = true
				uni.showLoading()
				let userId = null;
				if (!!this.toUserInfo.userID) {
					userId = this.toUserInfo.userID.toString();
				} else {
					userId = this.toUserInfo.id.toString();
				}
				this.$utils.postrequest("/api/is_video", {
					user_id: userId
				}, res => {
					if (res.code == 200) {
						uni.hideLoading()
						let status = res.data
						if (status) {
							this.audioRestriction = false
							uni.showToast({
								title: '正在通话中',
								icon: 'none'
							})
						} else {
							this.startVideoChat()
						}
					}
				})
			},
			startVideoChat() {
				uni.setStorageSync('chooseUser', JSON.stringify(this.toUserInfo));
				this.$utils.request("/api/tim/voiceRoomId", {}, res => {
					if (res.code == 200) {
						this.audioRestriction = false
						this.roomID = res.data
						uni.setStorageSync("roomid", this.roomID)
						this.sendMsg(res.data, 'videoChat')
						uni.navigateTo({
							url: "/pages/videoChat/videoChat?isCurrent=1"
						})
					}
				})
			},
			// 进入别人发起的聊天
			toVoiceRoom(id) {
				// console.log(id);
				uni.setStorageSync('roomid', id);
				uni.navigateTo({
					url: '../TRTC/TRTC?join=1'
				});
			},
			video() {
				let that = this;
				uni.chooseVideo({
					count: 1,
					sourceType: ['camera', 'album'],
					success: function(res) {
						let imgHref = res.tempFilePath;
						uni.uploadFile({
							url: 'http://c.voofan.com/api/upload',
							filePath: imgHref,
							name: 'file',
							success: datas => {
								that.sendMsg(JSON.parse(datas.data).data, 'video');
								that.hideDrawer();
							}
						});
					}
				});
			},
			sendAddres(data) {
				// "city": "重庆市",
				let msg = {
					text: data.callout.content
				};
				this.sendMsg(msg, 'text');
				this.mapState = false;
				this.markers = [];
			},
			videoErrorCallback: function(e) {
				// console.log('视频错误信息:');
				// console.log(e.target.errMsg);
			},
			//聊天的节点加上外层的div
			nodesFliter(str) {
				let nodeStr = '<div style="align-items: center;word-wrap:break-word;">' + str + '</div>';
				return nodeStr;
			},
			//时间过滤
			timeFliter(timer) {
				let timeData = new Date(timer * 1000);
				let str = this.$commen.dateTimeFliter(timeData);
				return str;
			},
			// 接受消息(定位消息)
			screenMsg(newVal, oldVal) {
				// // console.log(newVal,oldVal)
				let that = this;
				let infoNum = newVal.length % 15;
				if (newVal[0].ID && !infoNum) {
					this.scrollAnimation = false;
					if (newVal[0].ID != oldVal[0].ID && newVal.length >= this.count) {
						this.$nextTick(() => {
							this.scrollToView = oldVal[0].ID;
						});
					} else {
						this.$nextTick(() => {
							this.scrollToView = newVal[newVal.length - 1].ID;
						});
					}
				} else {
					this.$nextTick(() => {
						// this.scrollToView = newVal[newVal.length - 1].ID;
					});
				}
				if (this.destructionMessageStatus) {
					setTimeout(() => {
						let data = this.newData;

						// 主动撤回消息
						let promise = this.tim.revokeMessage(data[data.length - 1]);
						promise
							.then(function(imResponse) {
								// 消息撤回成功
								uni.showToast({
									title: '消息已读，已销毁',
									icon: 'none',
									success: res => {}
								});
								clearInterval(that.timer);
							})
							.catch(function(imError) {
								// 消息撤回失败
								console.warn('revokeMessage error:', imError);
							});
					}, 3000);
				}
			},
			//触发滑动到顶部(加载历史信息记录)
			loadHistory(e) {
				// 更多消息列表
				let conversationID = this.conversationActive.conversationID;
				let promise = this.tim.getMessageList({
					conversationID: conversationID,
					nextReqMessageID: this.nextReqMessageID,
					count: this.count
				});
				promise.then(res => {
					this.$store.commit('unshiftCurrentMessageList', res.data.messageList);
					this.nextReqMessageID = res.data.nextReqMessageID; // 用于续拉，分页续拉时需传入该字段。
					this.isCompleted = res.data.isCompleted;
				});
				//这段代码很重要，不然每次加载历史数据都会跳到顶部
				// this.$nextTick(function() {
				// 	// console.log(this.nextReqMessageID);
				// 	this.scrollToView = this.nextReqMessageID; //跳转上次的第一行信息位置
				// 	this.$nextTick(function() {
				// 		this.scrollAnimation = true; //恢复滚动动画
				// 	});
				// });
				this.isHistoryLoading = false;
			},
			// 加载初始页面消息
			getMsgList() {
				let that = this;
				// 历史消息列表
				let conversationID = this.conversationActive.conversationID;
				if (conversationID) {
					let promise = this.tim.getMessageList({
						conversationID: conversationID,
						count: this.count
					});
					promise.then(res => {
						let messageList = res.data.messageList;
						messageList.forEach((e, i) => {
							if (e.isRevoked == true) {
								messageList.splice(i, 1);
							}
						});
						this.$store.commit('pushCurrentMessageList', messageList);
						this.nextReqMessageID = res.data.nextReqMessageID; // 用于续拉，分页续拉时需传入该字段。
						this.isCompleted = res.data.isCompleted;
						if (messageList.length < 15) {
							this.loadHistory();
						}
						// this.scrollToView = res.data.messageList[res.data.messageList.length - 1].ID;
					});
				} else {}

				// 滚动到底部
				// setTimeout(() => {
				// 	//进入页面滚动到底部
				// 	this.scrollToView = 'bottom'
				// 	this.$nextTick(function() {
				// 		this.scrollAnimation = false;
				// 	});
				// }, 1000);
			},
			//处理图片尺寸，如果不处理宽高，新进入页面加载图片时候会闪
			setPicSize(content) {
				// 让图片最长边等于设置的最大长度，短边等比例缩小，图片控件真实改变，区别于aspectFit方式。
				let maxW = uni.upx2px(350); //350是定义消息图片最大宽度
				let maxH = uni.upx2px(350); //350是定义消息图片最大高度
				if (content.w > maxW || content.h > maxH) {
					let scale = content.w / content.h;
					content.w = scale > 1 ? maxW : maxH * scale;
					content.h = scale > 1 ? maxW / scale : maxH;
				}
				return content;
			},
			//更多功能(点击+弹出)
			showMore() {
				this.isVoice = false;
				this.hideEmoji = true;
				if (this.hideMore) {
					this.hideMore = false;
					this.openDrawer();
				} else {
					this.hideDrawer();
				}
			},
			// 打开抽屉
			openDrawer() {
				this.popupLayerClass = 'showLayer';
			},
			// 隐藏抽屉
			hideDrawer() {
				this.popupLayerClass = '';
				setTimeout(() => {
					this.hideMore = true;
					this.hideEmoji = true;
				}, 150);
			},
			// 选择图片发送
			chooseImage() {
				this.getImage('album');
			},
			//拍照发送
			camera() {
				this.getImage('camera');
			},

			//选照片 or 拍照
			getImage(type) {
				let that = this;
				this.hideDrawer();
				uni.chooseImage({
					sourceType: [type],
					count: 1,
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					success: res => {
						let imgHref = res.tempFilePaths[0];
						uni.uploadFile({
							url: 'http://c.voofan.com/api/upload',
							filePath: imgHref,
							name: 'file',
							success: datas => {
								that.sendMsg(JSON.parse(datas.data).data, 'img');
							}
						});
						// that.$utils.postrequest("/api/upload", formdata, function (resData) {
						//    if(resData.code==200){
						// 		that.sendMsg(resData.data, 'img');
						// 	}
						// })
					}
				});
			},
			//获取焦点，如果不是选表情ing,则关闭抽屉
			textareaFocus() {
				if (this.popupLayerClass == 'showLayer' && this.hideMore == false) {
					this.hideDrawer();
				}
			},
			// 发送文字消息
			sendText() {
				this.hideDrawer(); //隐藏抽屉
				if (!this.textMsg) {
					return;
				}
				let content = this.replaceEmoji(this.textMsg);
				let msg = {
					text: content
				};
				this.sendMsg(msg, 'text');
				this.textMsg = ''; //清空输入框
				let i = 0;
				this.timer = setInterval(() => {
					i++;
				}, 1000);
			},
			//替换表情符号为图片
			replaceEmoji(str) {
				let replacedStr = str.replace(/\[([^(\]|\[)]*)\]/g, (item, index) => {
					// console.log('item: ' + item);
					for (let i = 0; i < this.emojiList.length; i++) {
						let row = this.emojiList[i];
						for (let j = 0; j < row.length; j++) {
							let EM = row[j];
							if (EM.alt == item) {
								//在线表情路径，图文混排必须使用网络路径，请上传一份表情到你的服务器后再替换此路径
								//比如你上传服务器后，你的100.gif路径为https://www.xxx.com/emoji/100.gif 则替换onlinePath填写为https://www.xxx.com/emoji/
								let onlinePath = 'https://s2.ax1x.com/2019/04/12/';
								let imgstr = '<img src="' + onlinePath + this.onlineEmoji[EM.url] + '">';
								// console.log('imgstr: ' + imgstr);
								return imgstr;
							}
						}
					}
				});
				return replacedStr;
			},

			// 发送消息
			sendMsg(content, type) {
				let that = this;
				let message;
				let userId = '';
				if (!!this.toUserInfo.userID) {
					userId = this.toUserInfo.userID.toString();
				} else {
					userId = this.toUserInfo.id.toString();
				}

				if (type == 'text') {
					message = this.tim.createTextMessage({
						to: userId,
						// to: this.toUserInfo.id,
						conversationType: 'C2C',
						payload: {
							text: content.text
						}
					});
				} else if (type == 'img') {
					message = this.tim.createCustomMessage({
						// to: this.toUserInfo.id,
						to: userId,
						conversationType: 'C2C',
						payload: {
							data: 'chatFile', // 用于标识该消息类型
							description: content, // 用于装载url
							extension: ''
						}
					});
				} else if (type == 'voice') {
					let href = content.url.substr(0, content.url.indexOf('mp3') + 3);
					message = that.tim.createCustomMessage({
						// to: this.toUserInfo.id,
						to: userId,
						conversationType: 'C2C',
						// 消息优先级，用于群聊（v2.4.2起支持）。如果某个群的消息超过了频率限制，后台会优先下发高优先级的消息，详细请参考：https://cloud.tencent.com/document/product/269/3663#.E6.B6.88.E6.81.AF.E4.BC.98.E5.85.88.E7.BA.A7.E4.B8.8E.E9.A2.91.E7.8E.87.E6.8E.A7.E5.88.B6)
						// 支持的枚举值：TIM.TYPES.MSG_PRIORITY_HIGH, TIM.TYPES.MSG_PRIORITY_NORMAL（默认）, TIM.TYPES.MSG_PRIORITY_LOW, TIM.TYPES.MSG_PRIORITY_LOWEST
						// priority: TIM.TYPES.MSG_PRIORITY_NORMAL,
						payload: {
							data: 'voiceFile', // 用于标识该消息类型
							description: href, // 用于装载url
							extension: content.length
						}
					});
				} else if (type == 'video') {
					message = that.tim.createCustomMessage({
						// to: this.toUserInfo.id,
						to: userId,
						conversationType: 'C2C',
						// 消息优先级，用于群聊（v2.4.2起支持）。如果某个群的消息超过了频率限制，后台会优先下发高优先级的消息，详细请参考：https://cloud.tencent.com/document/product/269/3663#.E6.B6.88.E6.81.AF.E4.BC.98.E5.85.88.E7.BA.A7.E4.B8.8E.E9.A2.91.E7.8E.87.E6.8E.A7.E5.88.B6)
						// 支持的枚举值：TIM.TYPES.MSG_PRIORITY_HIGH, TIM.TYPES.MSG_PRIORITY_NORMAL（默认）, TIM.TYPES.MSG_PRIORITY_LOW, TIM.TYPES.MSG_PRIORITY_LOWEST
						// priority: TIM.TYPES.MSG_PRIORITY_NORMAL,
						payload: {
							data: 'videoFile', // 用于标识该消息类型
							description: content, // 用于装载url
							extension: ''
						}
					});
				} else if (type == 'mapFile') {
					message = that.tim.createCustomMessage({
						// to: this.toUserInfo.id,
						to: userId,
						conversationType: 'C2C',
						// 消息优先级，用于群聊（v2.4.2起支持）。如果某个群的消息超过了频率限制，后台会优先下发高优先级的消息，详细请参考：https://cloud.tencent.com/document/product/269/3663#.E6.B6.88.E6.81.AF.E4.BC.98.E5.85.88.E7.BA.A7.E4.B8.8E.E9.A2.91.E7.8E.87.E6.8E.A7.E5.88.B6)
						// 支持的枚举值：TIM.TYPES.MSG_PRIORITY_HIGH, TIM.TYPES.MSG_PRIORITY_NORMAL（默认）, TIM.TYPES.MSG_PRIORITY_LOW, TIM.TYPES.MSG_PRIORITY_LOWEST
						// priority: TIM.TYPES.MSG_PRIORITY_NORMAL,
						payload: {
							data: 'mapFile', // 用于标识该消息类型
							description: content.text, // 用于装载url
							extension: ''
						}
					});
				} else if (type == 'redEnvelopeData') {
					message = that.tim.createCustomMessage({
						// to: this.toUserInfo.id,
						to: userId,
						conversationType: 'C2C',
						// 消息优先级，用于群聊（v2.4.2起支持）。如果某个群的消息超过了频率限制，后台会优先下发高优先级的消息，详细请参考：https://cloud.tencent.com/document/product/269/3663#.E6.B6.88.E6.81.AF.E4.BC.98.E5.85.88.E7.BA.A7.E4.B8.8E.E9.A2.91.E7.8E.87.E6.8E.A7.E5.88.B6)
						// 支持的枚举值：TIM.TYPES.MSG_PRIORITY_HIGH, TIM.TYPES.MSG_PRIORITY_NORMAL（默认）, TIM.TYPES.MSG_PRIORITY_LOW, TIM.TYPES.MSG_PRIORITY_LOWEST
						// priority: TIM.TYPES.MSG_PRIORITY_NORMAL,
						payload: {
							data: 'redEnvelopeData', // 用于标识该消息类型
							description: content, // 用于装载url
							extension: ''
						}
					});
				} else if (type == 'redEnvelopeRes') {
					message = that.tim.createCustomMessage({
						// to: this.toUserInfo.id,
						to: userId,
						conversationType: 'C2C',
						// 消息优先级，用于群聊（v2.4.2起支持）。如果某个群的消息超过了频率限制，后台会优先下发高优先级的消息，详细请参考：https://cloud.tencent.com/document/product/269/3663#.E6.B6.88.E6.81.AF.E4.BC.98.E5.85.88.E7.BA.A7.E4.B8.8E.E9.A2.91.E7.8E.87.E6.8E.A7.E5.88.B6)
						// 支持的枚举值：TIM.TYPES.MSG_PRIORITY_HIGH, TIM.TYPES.MSG_PRIORITY_NORMAL（默认）, TIM.TYPES.MSG_PRIORITY_LOW, TIM.TYPES.MSG_PRIORITY_LOWEST
						// priority: TIM.TYPES.MSG_PRIORITY_NORMAL,
						payload: {
							data: 'redEnvelopeRes', // 用于标识该消息类型
							description: content, // 用于装载url
							extension: ''
						}
					});
				} else if (type == 'voiceChat') {
					message = that.tim.createCustomMessage({
						// to: this.toUserInfo.id,
						to: userId,
						conversationType: 'C2C',
						// 消息优先级，用于群聊（v2.4.2起支持）。如果某个群的消息超过了频率限制，后台会优先下发高优先级的消息，详细请参考：https://cloud.tencent.com/document/product/269/3663#.E6.B6.88.E6.81.AF.E4.BC.98.E5.85.88.E7.BA.A7.E4.B8.8E.E9.A2.91.E7.8E.87.E6.8E.A7.E5.88.B6)
						// 支持的枚举值：TIM.TYPES.MSG_PRIORITY_HIGH, TIM.TYPES.MSG_PRIORITY_NORMAL（默认）, TIM.TYPES.MSG_PRIORITY_LOW, TIM.TYPES.MSG_PRIORITY_LOWEST
						// priority: TIM.TYPES.MSG_PRIORITY_NORMAL,
						payload: {
							data: 'voiceChat', // 用于标识该消息类型
							description: content, // 用于装载url
							extension: JSON.stringify(this.userInfo)
						}
					});
				} else if (type == 'videoChat') {
					message = that.tim.createCustomMessage({
						// to: this.toUserInfo.id,
						to: userId,
						conversationType: 'C2C',
						// 消息优先级，用于群聊（v2.4.2起支持）。如果某个群的消息超过了频率限制，后台会优先下发高优先级的消息，详细请参考：https://cloud.tencent.com/document/product/269/3663#.E6.B6.88.E6.81.AF.E4.BC.98.E5.85.88.E7.BA.A7.E4.B8.8E.E9.A2.91.E7.8E.87.E6.8E.A7.E5.88.B6)
						// 支持的枚举值：TIM.TYPES.MSG_PRIORITY_HIGH, TIM.TYPES.MSG_PRIORITY_NORMAL（默认）, TIM.TYPES.MSG_PRIORITY_LOW, TIM.TYPES.MSG_PRIORITY_LOWEST
						// priority: TIM.TYPES.MSG_PRIORITY_NORMAL,
						payload: {
							data: 'videoChat', // 用于标识该消息类型
							description: content, // 用于装载url
							extension: JSON.stringify(this.userInfo)
						}
					});
				}
				// mapFile
				// voice
				// console.log(message);
				this.$store.commit('pushCurrentMessageList', message);
				let pomise = this.tim.sendMessage(message);
				pomise.then(res => {
					this.$nextTick(() => {
						// 滚动到底
						this.scrollToView = res.data.message.ID;
					});
				});
			},

			// // 添加文字消息到列表
			// addTextMsg(msg) {
			// 	this.msgList.push(msg);
			// },
			// // 添加语音消息到列表
			// addVoiceMsg(msg) {
			// 	this.msgList.push(msg);
			// },
			// // 添加图片消息到列表
			// addImgMsg(msg) {
			// 	msg.content = this.setPicSize(msg.payload.description);
			// 	this.msgImgList.push(msg.payload.description);
			// 	this.msgList.push(msg);
			// },
			// addRedEnvelopeMsg(msg) {
			// 	this.msgList.push(msg);
			// },
			// // 添加系统文字消息到列表
			// addSystemTextMsg(msg) {
			// 	this.msgList.push(msg);
			// },

			sendSystemMsg(content, type) {
				let lastid = this.msgList[this.msgList.length - 1].msg.id;
				lastid++;
				let row = {
					type: 'system',
					msg: {
						id: lastid,
						type: type,
						content: content
					}
				};
				this.screenMsg(row);
			},
			// 获取定位
			getLocation() {
				let that = this;
				uni.navigateTo({
					url: '/pages/tim/map?type=0'
				});
			},

			// 预览图片
			showPic(msg) {
				uni.previewImage({
					indicator: 'none',
					current: msg.payload.description,
					urls: [msg.payload.description]
				});
			},
			// 播放语音
			playVoice(msg) {
				this.playMsgid = msg.ID;
				this.AUDIO.src = msg.payload.description;
				this.$nextTick(function() {
					this.AUDIO.play();
				});
			},
			// 录音开始
			voiceBegin(e) {
				if (e.touches.length > 1) {
					return;
				}
				this.initPoint.Y = e.touches[0].clientY;
				this.initPoint.identifier = e.touches[0].identifier;
				this.RECORDER.start({
					duration: 60000, // 录音的时长，单位 ms，最大值 600000（10 分钟）
					sampleRate: 44100, // 采样率
					numberOfChannels: 1, // 录音通道数
					encodeBitRate: 192000, // 编码码率
					format: 'mp3' // 音频格式，选择此格式创建的音频消息，可以在即时通信 IM 全平台（Android、iOS、微信小程序和 Web）互通
				}); //录音开始,
			},
			//录音开始UI效果
			recordBegin(e) {
				this.recording = true;
				this.voiceTis = '松开 结束';
				this.recordLength = 0;
				this.recordTimer = setInterval(() => {
					this.recordLength++;
				}, 1000);
			},
			// 录音被打断
			voiceCancel() {
				this.recording = false;
				this.voiceTis = '按住 说话';
				this.recordTis = '手指上滑 取消发送';
				this.willStop = true; //不发送录音
				this.RECORDER.stop(); //录音结束
			},
			// 录音中(判断是否触发上滑取消发送)
			voiceIng(e) {
				// console.log(uni.upx2px(100));
				if (!this.recording) {
					return;
				}
				let touche = e.touches[0];
				//上滑一个导航栏的高度触发上滑取消发送
				if (this.initPoint.Y - touche.clientY >= uni.upx2px(150)) {
					this.willStop = true;
					this.recordTis = '松开手指 取消发送';
				} else {
					this.willStop = false;
					this.recordTis = '手指上滑 取消发送';
				}
			},
			// 结束录音
			voiceEnd(e) {
				if (!this.recording) {
					return;
				}
				this.recording = false;
				this.voiceTis = '按住 说话';
				this.recordTis = '手指上滑 取消发送';
				this.RECORDER.stop(); //录音结束
			},
			recordEnd(e) {
				let progress1 = 0;
				let interval;
				let that = this;
				// debugger
				clearInterval(this.recordTimer);
				uni.uploadFile({
					url: 'http://c.voofan.com/api/upload',
					filePath: e.tempFilePath,
					name: 'file',
					success: datas => {
						let msg = {
							href: '',
							length: ''
						};
						msg.url = JSON.parse(datas.data).data;
						let min = parseInt(that.recordLength / 60);
						let sec = that.recordLength % 60;
						min = min < 10 ? '0' + min : min;
						sec = sec < 10 ? '0' + sec : sec;
						msg.length = min + ':' + sec;
						this.sendMsg(msg, 'voice');
					}
				});
			},
			// 切换语音/文字输入
			switchVoice() {
				this.hideDrawer();
				this.isVoice = this.isVoice ? false : true;
			},
			discard() {
				return;
			},
			toPage(item) {
				uni.navigateTo({
					url: '/pages/my/mydongtai?id=' + this.toUserInfo.userID
				})
			},
		}
	};
</script>
<style lang="less">
	.count-down {
		position: fixed;
		left: 20px;
		top: 120px;
		background-color: rgba(255, 255, 255, 0.5);
		width: 100px;
		height: 100px;
		text-align: center;
		line-height: 100px;
		color: #fff;
		z-index: 6666;
		border-radius: 50%;
		font-size: 60px;
	}

	.back-theme {
		background-color: #000;

		.bubble,
		.map-content1 {
			background-color: rgb(241, 184, 91) !important;
			color: #fff !important;
		}

		.uni-input-placeholder {
			color: #fff !important;
		}
	}

	.mask {
		position: fixed;
		top: 0;
		left: 0;
		z-index: 999;
		width: 100%;
		height: 100vh;
		/* background-color:rgba(0,0,0,0.2); */
	}

	.funcBtn {
		width: 200rpx;
		height: 50rpx;
		background-color: rgba(0, 0, 0, 0.8);
		border-radius: 15rpx;
		color: #ffffff;
		float: right;
		margin-top: -50rpx;
		display: flex;
		align-items: center;
		position: absolute;
		justify-content: center;
		z-index: 9999;
	}

	.func {
		width: 100rpx;
		text-align: center;
	}

	.red-Res {
		width: 100%;
		text-align: center;
		color: #a2a1a0;
		font-size: 24rpx;
		// margin-top: -100rpx;
	}

	.box-pandding {
		padding: 15upx 20upx;
	}

	.red-Res-item {
		width: 100%;
		text-align: center;
		color: #a2a1a0;
		font-size: 24rpx;
		// margin-top: -85rpx;
	}

	.chatImg {
		width: 240rpx;
		display: flex;
		align-items: center;
	}

	.chatImg image {
		max-width: 360rpx;
		border-radius: 15rpx;
	}

	.redEnvelopeBox {
		background-color: red;
		height: 168rpx;
		width: 450rpx;
		border-radius: 25rpx;
	}

	.redEnvelopeSendIcon {
		height: 168rpx;
		width: 450rpx;
	}

	.map {
		position: relative;
		overflow: hidden;
	}

	.map-text {
		position: absolute;
		top: 0px;
		padding: 3px;
	}

	.map-content1 {
		font-size: 24rpx;
		height: 100%;
		width: 170rpx;
		background-color: rgb(46, 197, 244);
		color: #f1f1f1;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		border-radius: 12rpx;
		padding: 0rpx 15rpx 0rpx 15rpx;
		position: relative;
	}

	.map-content1 input {
		width: 120rpx;
	}

	.uni-video-container {
		z-index: 20;
	}

	.page-body {
		z-index: 99999999;
		position: absolute;
		left: 0;
		top: 0;
		right: 0;
		bottom: 0;
	}

	.address-list-box {
		height: 30px;
		line-height: 30px;
		height: 30px;
		line-height: 30px;
		border-bottom: 1px #ddd solid;
		padding-left: 10px;
	}

	.left-img {
		width: 5px;
		height: 12px;
		margin-top: 12px;
		background: url(../../static/pages/message_right.png) no-repeat;
		background-size: cover;
	}

	.right-img {
		width: 5px;
		height: 12px;
		margin-top: 6px;
		background: url(../../static/pages/message_left.png) no-repeat;
		background-size: cover;
	}
</style>
<style lang="scss">
	@import '@/static/HM-chat/css/style.scss';
</style>
